<style>
    .table th, .table td {
        text-align: center;
        height:38px;
    }
</style>

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<div class="row">
<h1 class="btn btn-warning pull-left">金卡价格设置</h1>
</div>
   <br>

<section class="panel panel-default">
    <div class="panel-body" data-ng-controller="CollapseDemoCtrl">
        <button class="btn btn-success btn-lg" ng-click="isCollapsed = !isCollapsed">对应场租价格设置</button>
        <div class="divider divider-md"></div>
        <div collapse="!isCollapsed">
            <div class="table-responsive">
                <table class="table table-striped table-bordered table-hover pull-left " style="width: 900px">
                    <thead>
                    <tr>
                        <div class="col-xs-3" style="width: 225px">
                            <th style="width: 225px">编号</th>
                        </div>
                        <div class="col-xs-3" style="width: 225px">
                            <th style="width: 225px">场地</th>
                        </div>
                        <div class="col-xs-3">
                            <th style="width: 225px">价格方案</th>
                        </div>
                        <div class="col-xs-3" >
                            <th style="width: 225px">折扣率(%)</th>
                        </div>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td>
                                <select class="form-control">
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                </select>
                            </td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td>
                                <select class="form-control">
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                </select>
                            </td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td>
                                <select class="form-control">
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                    <option>羽毛球普通价</option>
                                </select>
                            </td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</section>

<section class="panel panel-default">
    <div class="panel-body" data-ng-controller="CollapseDemoCtrl">
        <button class="btn btn-success btn-lg" ng-click="isCollapsed = !isCollapsed">对应售票价格设置</button>
        <div class="divider divider-md"></div>
        <div collapse="!isCollapsed">
            <div class="table-responsive">
                <table class="table table-striped table-bordered table-hover pull-left " style="width: 900px">
                    <thead>
                    <tr>
                        <div class="col-xs-2" style="width: 225px">
                            <th style="width: 225px">编号</th>
                        </div>
                        <div class="col-xs-2" style="width: 225px">
                            <th style="width: 225px">对应类型项目</th>
                        </div>
                        <div class="col-xs-2">
                            <th style="width: 225px">对应票类</th>
                        </div>

                        <div class="col-xs-2">
                            <th style="width: 225px">对应票名</th>
                        </div>

                        <div class="col-xs-2" >
                            <th style="width: 225px">折扣率(%)</th>
                        </div>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <div class="col-xs-2">
                            <td>1</td>
                        </div>
                        <div class="col-xs-2">
                            <td>游泳</td>
                        </div>
                        <div class="col-xs-2">
                            <td>
                                <select class="form-control">
                                    <option>普通票</option>
                                    <option>会员票</option>
                                    <option>会员票</option>
                                </select>
                            </td>
                        </div>

                        <div class="col-xs-3">
                         <td><button type="button" class="btn btn-success" data-toggle="modal"
                                     data-target="#myModal">选择</button></td>
                        </div>

                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    <tr>
                        <div class="col-xs-2">
                            <td>1</td>
                        </div>
                        <div class="col-xs-2">
                            <td>游泳</td>
                        </div>
                        <div class="col-xs-2">
                            <td>
                                <select class="form-control">
                                    <option>普通票</option>
                                    <option>会员票</option>
                                    <option>会员票</option>
                                </select>
                            </td>
                        </div>

                        <div class="col-xs-3">
                            <td><button type="button" class="btn btn-success" data-toggle="modal"
                                data-target="#myModal">选择</button></td>
                        </div>

                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</section>



<section class="panel panel-default">
    <div class="panel-body" data-ng-controller="CollapseDemoCtrl">
        <button class="btn btn-success btn-lg" ng-click="isCollapsed = !isCollapsed">商品折扣信息</button>
        <div class="divider divider-md"></div>
        <div collapse="!isCollapsed">


            <div class="table-responsive">
                <table class="table table-striped table-bordered table-hover pull-left " style="width: 900px">
                    <thead>
                    <tr>
                        <div class="col-xs-3" style="width: 225px">
                            <th style="width:300px">编号</th>
                        </div>
                        <div class="col-xs-3" style="width: 225px">
                            <th style="width: 300px">商品类型</th>
                        </div>
                        <div class="col-xs-3" >
                            <th style="width: 300px">折扣率(%)</th>
                        </div>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>

                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>
                    <tr>
                        <div class="col-xs-3">
                            <td>1</td>
                        </div>
                        <div class="col-xs-3">
                            <td>羽毛球木地板</td>
                        </div>
                        <div class="col-xs-3">
                            <td ><input type="text"></td>
                        </div>
                    </tr>

                    </tbody>
                </table>
            </div>

        </div>
    </div>
</section>



<div class="container">
    <div class="row">
        <div class="col-lg-4"></div>
        <div class="col-lg-4">

            <div>
        <div class="col-lg-4"></div>
                <button type="button" class="btn btn-success">确定</button>
                <button type="button" class="btn btn-danger">取消</button>

            </div>
</div>

</div>

</div>






<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    可以选择一个或多个
                </h4>
            </div>
            <div class="modal-body">
               <!-- 在这里添加一些文本-->

                <div class="checkbox">
                    <label><input type="checkbox" value="">儿童票:</label>
                </div>
                <div class="checkbox">
                    <label><input type="checkbox" value="">优惠票:</label>
                </div>
                <div class="checkbox">
                    <label><input type="checkbox" value="">成人票:</label>
                </div>
         <!--       <div class="container">
                    <div class="row">
                        <div class="col-lg-2">
                            <form class="form-inline">
                                <label >成人票:</label>
                                <select class="form-control">
                                    <option>充200送100</option>
                                    <option>充100送200</option>
                                    <option>充150送150</option>
                                </select>
                            </form>
                        </div>
                        <div class="col-lg-2">
                            <form class="form-inline">
                                <div class="form-group">
                                    <label >儿童票:</label>
                                    <input type="text" class="form-control " placeholder="请卡类型名称">
                                </div>
                            </form>
                        </div>
                        <div class="col-lg-2">
                            <form class="form-inline">
                                <div class="form-group">
                                    <label >优惠票:</label>
                                    <input type="text" class="form-control " placeholder="请卡类型名称">
                                </div>
                            </form><div class="col-lg-2">
                            <form class="form-inline">
                                <div class="form-group">
                                    <label >活动票:</label>
                                    <input type="text" class="form-control " placeholder="请卡类型名称">
                                </div>
                            </form>
                        </div>
                        </div>

                    </div>
                    </div>-->
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">取消
                </button>
                <button type="button" class="btn btn-primary">
                    确定
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div>
    </div>